$(function () {
    // 自定义校验规则
    layui.form.verify({
        // 自定义的校验规则，(验证两个密码输入框输入的内容是否一样，相等则校验成功，不相等则校验失败)
        rePwd:function(val){
            // 获取到密码框的值
            // [name="password"] 表示属性选择器
            const pwd = $('.reg-box [name="password"]').val().trim()
            // 判断两个密码输入框的内容是否一致，再次确认密码输入框的值通过形参传递过来
            if(pwd !== val){
                // 表示两个密码框的值不一样，
                return '输入的两次密码不一致！'
            }
            // 如果校验通过，不需要做任何处理
        },
        // 校验密码长度的校验规则
        pwd: [/^[\S]{6,12}$/, '密码必须6到12位，且不能出现空格']
    })

    // 点击了注册的链接
     $('#link-reg').on('click', function () {
        // 展示注册盒子
        $('.login-box').hide() 
        // 隐藏登录的盒子
        $('.reg-box').show()
    })

    // 点击了登录的链接
    $('#link-login').on('click', function () {
        // 展示登录的盒子
        $('.login-box').show() 
        // 隐藏注册的盒子
        $('.reg-box').hide() 
    })

    // 为注册表单注册提交事件，阻止表单默认提交行为，发起Ajax请求，提交数据
    $('.reg-box form').on('submit',function(e){
        // 阻止表单默认的提交行为
        e.preventDefault()
        // 发起Ajax请求，提交表单数据
        $.ajax({
            type:'POST',
            url:'/api/reguser',
            data:{
                username:$('.reg-box [name="username"]').val().trim(),
                password:$('.reg-box [name="password"]').val().trim()
            },
            success:function(res){
                if(res.status === 0){
                    // 表示注册成功
                    layer.msg('注册成功,请登录!', {icon: 1})
                    // 模拟“去登录”的 点击行为
                    $('#link-login').click()
                } else {
                    // 表示注册失败
                    layer.msg(res.message, {icon: 2})
                }
            }
        })
    })

    // 监听登录表单 submit 事件
    $('.login-box form').on('submit',function(e){
        // 阻止表单的默认提交行为
        e.preventDefault()
        // 发起 Ajax 请求，获取数据
        $.ajax({
            type: 'POST',
            url: '/api/login',
            data: $(this).serialize(),
            success: function(res){
                if(res.status === 0){
                    console.log('ok');
                    // 表示注册成功
                    layer.msg(res.message, {icon: 1})
                    // 将服务器颁发的 token 字符串，持久化存储到 localStorage
                    localStorage.setItem('token', res.token)
                    // 以JS的方式  跳转到后台首页
                    location.href = 'index.html'
                } else {
                    // 表示注册失败
                    layer.msg(res.message, {icon: 2})
                }
            }
        })
    })
})